<template>
  <view class="ikz-bid">
    <ikz-loading :css-data="loading_css"></ikz-loading>
    <!-- list -->
    <ikz-topbg></ikz-topbg>
    <view class="ikz-orderdetail">
      <view class="ikz-tipss">
        <view class="ikz-tips-title" v-if="show_info.status == 0">
          待支付
        </view>
        <view class="ikz-tips-title" v-if="show_info.status == 1 && show_info.super_goods.business_info.name">
          待接单
        </view>
        <view class="ikz-tips-title" v-if="show_info.status == 2">
          待完成
        </view>
        <view class="ikz-tips-title" v-if="show_info.status == 3">
          已完成
        </view>
        <view class="ikz-tips-title" v-if="show_info.status == 7">
          已送达
        </view>
        <view class="ikz-tips-title" v-if="show_info.status == 4">
          已取消
        </view>
        <view
          class="ikz-tips-desc"
          v-if="show_info.status == 1 || show_info.status == 0"
        >
          订单超过一小时将自动取消
        </view>
      </view>
      <view class="ikz-orderdetail-top">
        <view class="ikz-orderdetail-top-code">
          <view class="ikz-orderdetail-top-num">
            订单编号：{{ show_info.order_no }}
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 0">
            待支付
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 1 && show_info.super_goods.business_info.name">
            待接单
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 2">
            待完成
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 3">
            已完成
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 7">
            已送达
          </view>
          <view class="ikz-orderdetail-top-status" v-if="show_info.status == 4">
            已取消
          </view>
        </view>
        <view class="ikz-orderdetail-list-item">
          <view class="ikz-orderdetail-list-top">
            <view class="ikz-orderdetail-list-head">
              <image
                class="ikz-orderdetail-list-img"
                :src="show_info.avatar"
              ></image>
            </view>
            <view class="ikz-orderdetail-list-head-right">
              <view class="ikz-orderdetail-list-head-right-box">
                <view class="ikz-orderdetail-list-head-name">
                  {{ show_info.nickname }}
                </view>
                <view class="ikz-orderdetail-list-head-time">
                  {{ show_info.createtime }}
                </view>
              </view>
              <view class="ikz-orderdetail-list-head-right-box">
                <view class="ikz-orderdetail-list-head-card">
                  <template v-if="show_info.type == 2">
                    <!-- 快递自取 -->
                    快递自取
                  </template>
                  <template
                    v-else-if="show_info.type == 1 && show_info.super_goods"
                  >
                    <!-- 校园跑腿-商家 -->
                    商家订单-商家
                  </template>
                  <template
                    v-else-if="show_info.type == 1 && !show_info.super_goods"
                  >
                    <!-- 校园跑腿 -->
                    跑腿订单-个人
                  </template>
                  <template v-else>
                    {{ show_info.type_text }}
                  </template>
                </view>

                <!-- 
                <view class="ikz-orderdetail-list-head-card">
                  {{ show_info.type_text }}
                </view> -->
                <view class="ikz-orderdetail-list-head-price">
                  ￥{{ show_info.total_fee }}
                </view>
              </view>
            </view>
          </view>
          <view class="ikz-orderdetail-list-content">
            {{ show_info.information }}
          </view>
        </view>
      </view>
      <view class="ikz-receive-box" v-if="show_info.receive.nickname">
        <view class="ikz-receive-box-top">
          <view class="ikz-receive-title">
            <image
              class="ikz-receive-img"
              src="/static/campus/receive.png"
            ></image>
            抢单员
          </view>
          <view class="ikz-receive-user">
            <view class="ikz-receive-user-name">
              骑手名称：{{ show_info.receive.nickname }}
            </view>
          </view>
        </view>

        <view
          class="ikz-detail-phone"
          @click="getPhone(show_info.receive.mobile)"
        >
          <image src="/static/phone.png" class="ikz-detail-phone-img"></image>
          拨打电话
        </view>
      </view>
      <view
        class="ikz-receive-box"
        v-if="show_info.super_goods.business_info.name"
      >
        <view class="ikz-receive-box-top">
          <view class="ikz-receive-title">
            <image
              class="ikz-receive-img"
              src="/static/campus/receive.png"
            ></image>
            商家
          </view>
          <view class="ikz-receive-user">
            <view class="ikz-receive-user-name">
              店铺名称：{{ show_info.super_goods.business_info.name }}
            </view>
          </view>
        </view>

        <view
          class="ikz-detail-phone"
          @click="getPhone(show_info.super_goods.business_info.phone)"
        >
          <image src="/static/phone.png" class="ikz-detail-phone-img"></image>
          拨打电话
        </view>
      </view>
      <view class="ikz-orderdetail-other">
        <view class="ikz-orderdetail-other-title" v-if="show_info.down_url">
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot2"></view>
            <view class="ikz-orderdetail-other-top-title"> 下载链接 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.down_url }}
          </view>
        </view>
        <view
          class="ikz-orderdetail-other-title"
          v-if="show_info.receive_email"
        >
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot1"></view>
            <view class="ikz-orderdetail-other-top-title"> 收货邮箱 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.receive_email }}
          </view>
        </view>
        <view
          class="ikz-orderdetail-other-title"
          v-if="show_info.receive_limit"
        >
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot2"></view>
            <view class="ikz-orderdetail-other-top-title"> 抢单限制 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.receive_limit }}
          </view>
        </view>
        <view class="ikz-orderdetail-other-title" v-if="show_info.game_time">
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot1"></view>
            <view class="ikz-orderdetail-other-top-title"> 游戏时间 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.game_time }}
          </view>
        </view>
        <view
          class="ikz-orderdetail-other-title"
          v-if="show_info.game_platform"
        >
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot"></view>
            <view class="ikz-orderdetail-other-top-title"> 游戏名称 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.game_platform }}
          </view>
        </view>

        <view class="ikz-orderdetail-other-title" v-if="show_info.start">
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot"></view>
            <view class="ikz-orderdetail-other-top-title"> 取货地址 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.start }}
          </view>
        </view>
        <view class="ikz-orderdetail-other-title" v-if="show_info.destination">
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot1"></view>
            <view class="ikz-orderdetail-other-top-title"> 收货地址 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.destination }}
          </view>
        </view>

        <view
          class="ikz-orderdetail-other-title"
          v-if="show_info.lease_duration"
        >
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot2"></view>
            <view class="ikz-orderdetail-other-top-title"> 租借时长 </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.lease_duration }}
          </view>
        </view>
        <view class="ikz-orderdetail-other-title" v-if="show_info.hope_arrive">
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot1"></view>
            <view
              class="ikz-orderdetail-other-top-title"
              v-if="show_info.type == 4"
            >
              预计交付时间
            </view>
            <view class="ikz-orderdetail-other-top-title" v-else>
              预计送达时间
            </view>
          </view>
          <view class="ikz-orderdetail-other-content">
            {{ show_info.hope_arrive }}
          </view>
        </view>

        <view
          class="ikz-orderdetail-other-title"
          v-if="show_info.receive.nickname && show_info.status == 2"
        >
          <view class="ikz-orderdetail-other-top">
            <view class="ikz-sticky-spot2"></view>
            <view class="ikz-orderdetail-other-top-title"> 配送状态： </view>
          </view>
          <view
            class="ikz-orderdetail-other-content"
            :style="{ color: overtimeInfo.color }"
          >
            {{ overtimeInfo.text }}
          </view>
          <view
            v-if="show_info.type == 1 && show_info.super_goods"
            class="ikz-orderdetail-other-content"
            style="color: #ff6565; font-size: 24rpx; margin-top: 10rpx"
          >
            <uni-icons
              type="info"
              size="16"
              color="#f40"
              style="margin-right: 5px"
            ></uni-icons
            >如超时十分钟，可免责取消订单,系统将会退回全部费用。
          </view>
        </view>
      </view>
      <view
        class="ikz-take"
        v-for="(item, index) in show_info.express"
        :key="index"
      >
        <image class="ikz-take-img" src="/static/campus/box.png"></image>
        <view class="ikz-take-center">
          <view class="ikz-take-title">
            {{ item.type }}：￥{{ item.price }}
          </view>
          <view class="ikz-take-tips">
            {{ item.desc }}
          </view>
        </view>
        <view class="ikz-take-right">
          <view style="width: 50rpx; height: 50rpx"> </view>
          <view class="ikz-take-num">x{{ item.number || "" }}</view>
          <view style="width: 50rpx; height: 50rpx"> </view>
        </view>
      </view>
      <view class="ikz-tips" v-if="show_info.remarks">
        <view class="ikz-tips-item">
          <view class="ikz-tips-help">
            <view class="ikz-tips-help-title"> 备注信息 </view>
            <view class="ikz-tips-help-content">
              {{ show_info.remarks }}
            </view>
          </view>
        </view>
      </view>
      <view class="ikz-tips" v-if="show_info.type == 2">
        <!-- 快递自取 -->
        <view class="ikz-tips-item">
          <view class="ikz-tips-price-title">配送费，赏金</view>
          <view class="ikz-tips-price"> ￥{{ show_info.total_fee }} </view>
        </view>
      </view>

      <view
        class="ikz-tips"
        v-if="show_info.type == 1 && show_info.super_goods"
      >
        <!-- 校园跑腿-商家 -->
        <view class="ikz-tips-item">
          <view class="ikz-tips-price-title"
            >订单价格，保证金，配送费已支付</view
          >
          <view class="ikz-tips-price">
            ￥{{
              show_info.super_goods.bond * 2 + show_info.super_goods.total_fee
            }}
          </view>
        </view>
      </view>

      <view
        class="ikz-tips"
        v-if="show_info.type == 1 && !show_info.super_goods"
      >
        <!-- 校园跑腿 -->
        <view class="ikz-tips-item">
          <view class="ikz-tips-price-title">配送费，赏金</view>
          <view class="ikz-tips-price"> ￥{{ show_info.total_fee }} </view>
        </view>
      </view>
      <view
        class="ikz-tips"
        v-if="show_info.type == 1 && show_info.super_goods"
      >
        <view style="color: #ff5722">
          <uni-icons
            type="info"
            size="16"
            color="#f40"
            style="margin-right: 5px"
          ></uni-icons
          >正常完成系统将会退回保证金</view
        >
      </view>
      <view class="ikz-tips" v-if="show_info.super_goods.cancel_reason">
        <view style="color: #ff5722">
          <uni-icons
            type="info"
            size="16"
            color="#f40"
            style="margin-right: 5px"
          ></uni-icons>
          商家取消原因：{{ show_info.super_goods.cancel_reason }}</view
        >
      </view>
      <!-- 商品信息 -->
      <view class="goods-info" v-if="show_info.super_goods.goods">
        <view
          class="goods-item"
          v-for="(item, index) in show_info.super_goods.goods"
          :key="index"
        >
          <image
            class="goods-image"
            :src="'https://dexinhebei.com/' + item.image"
          ></image>
          <view class="goods-detail">
            <text class="goods-name">{{ item.name }}</text>
            <text class="goods-price">￥{{ item.price }}</text>
            <text class="goods-count">数量：{{ item.goods_count }}</text>
          </view>
        </view>
      </view>

      <!-- <view class="ikz-tips" v-if="show_info.reward">
        <view class="ikz-tips-item">
          <view class="ikz-tips-price-title"> 赏金 </view>
          <view class="ikz-tips-price"> ￥{{ show_info.reward }} </view>
        </view>
      </view> -->
      <view
        class="ikz-tips"
        v-if="
          show_info.annex_information_images &&
          show_info.annex_information_images.length
        "
      >
        <view class="ikz-tips-item">
          <view class="ikz-tips-help">
            <view class="ikz-tips-help-title"> 备注信息 </view>
            <view class="ikz-updata-bottom">
              <view
                class="ikz-updata-add"
                v-for="(item, index) in show_info.annex_information_images"
                :key="index"
              >
                <image
                  class="ikz-updata-img"
                  mode="aspectFill"
                  @click="showPic(show_info.annex_information_images, item)"
                  :src="item"
                ></image>
              </view>
            </view>
          </view>
        </view>
      </view>
      <view
        class="ikz-bottom"
        v-if="
          show_info.status == 0 && show_info.type == 1 && show_info.super_goods
        "
      >
        <view
          class="ikz-help-btn"
          @click="pay(show_info.id, show_info.total_fee)"
          >去支付
        </view>
        <view class="ikz-help-btn1" @click="cancel(show_info.id, show_info)"
          >取消订单
        </view>
      </view>
      <view
        class="ikz-bottom"
        v-if="
          show_info.status == 1 && show_info.type == 1 && show_info.super_goods
        "
      >
        <view class="ikz-help-btn1" @click="cancel(show_info.id, show_info)"
          >取消订单
        </view>
      </view>
      <view
        class="ikz-bottom"
        v-if="
          show_info.status == 2 && show_info.type == 1 && show_info.super_goods
        "
      >
        <view class="ikz-help-btn1" @click="cancel(show_info.id, show_info)"
          >取消订单
        </view>
      </view>
      <view
        class="ikz-bottom"
        v-if="
          show_info.status == 1 &&
          (show_info.type == 1 || show_info.type == 2) &&
          !show_info.super_goods
        "
      >
        <view class="ikz-help-btn1" @click="cancel1(show_info.id, show_info)"
          >取消订单
        </view>
      </view>
      <view class="ikz-bottom" v-if="show_info.status == 7">
        <view class="ikz-help-btn2" @click="submit(show_info.id)"
          >确认收货
        </view>
      </view>
    </view>
    <!-- list -->
  </view>
</template>

<script>
import ikzLoading from "@/pages/Component/Public/Loading/loading.vue";
import ikzOrderdetail from "@/pages/Component/Public/Orderdetail/public/orderdetail/orderdetail.vue";
import ikzTopbg from "@/pages/Component/Public/Topbg/public/topbg/topbg.vue";
var app = getApp();
import ikz from "@/pages/Common/tools.js";
export default {
  components: {
    ikzLoading,
    ikzOrderdetail,
    ikzTopbg,
  },
  data() {
    return {
      template_id: {},
      id: "",
      loading_css: {
        display: "flex",
      },
      show_info: {},
      show_status: 2,
      // 新增超时信息
      overtimeInfo: {
        text: "正常配送中",
        color: "green",
      },
      // 新增定时器
      overtimeTimer: null,
    };
  },
  mounted() {
    this.startOvertimeCheck();
  },

  beforeDestroy() {
    this.clearOvertimeCheck();
  },
  onLoad(options) {
    this.id = options.id;
    this.detailInfo((res) => {
      this.loading_css.display = "none";
    });
  },
  onPullDownRefresh() {
    this.detailInfo((res) => {
      uni.stopPullDownRefresh();
    });
  },
  onShow() {
    this.templateId((res) => {
      this.loading_css.display = "none";
    });
    if (this.show_status == 2) {
      this.show_status = 3;
    } else {
      this.detailInfo((res) => {
        this.loading_css.display = "none";
      });
    }
  },
  methods: {
    formatDateTime(input) {
      // 使用正则表达式匹配日期和时间部分
      const match = input.match(
        /^(\d{4})-(\d{1,2})-(\d{1,2}) (\d{1,2}):(\d{2})-(\d{1,2}):(\d{2})$/
      );
      if (!match) {
        return input; // 如果不是目标格式，直接返回原字符串
      }

      // 提取年、月、日和时间部分
      const [_, year, month, day, startHour, startMinute, endHour, endMinute] =
        match;

      // 格式化月份和日期为两位数
      const formattedMonth = String(month).padStart(2, "0");
      const formattedDay = String(day).padStart(2, "0");

      // 格式化时间部分
      const formattedStartHour = String(startHour).padStart(2, "0");
      const formattedEndHour = String(endHour).padStart(2, "0");

      // 返回格式化后的字符串
      return `${year}-${formattedMonth}-${formattedDay} ${formattedStartHour}:${startMinute}-${formattedEndHour}:${endMinute}`;
    },
    // 新增方法：启动超时检查
    startOvertimeCheck() {
      this.overtimeTimer = setInterval(() => {
        if (this.show_info.receive_time && this.show_info.hope_arrive) {
          this.calculateOverTime(
            this.show_info.receive_time,
            this.formatDateTime(this.show_info.hope_arrive)
          );
        }
      }, 1000); // 每秒检查一次
    },

    // 新增方法：清除定时器
    clearOvertimeCheck() {
      if (this.overtimeTimer) {
        clearInterval(this.overtimeTimer);
        this.overtimeTimer = null;
      }
    },
    calculateOverTime(receiveTime, hopeArrive) {
      // //console.log(receiveTime, hopeArrive, "ddddddddddd");
      // 如果缺少必要参数，返回默认值
      if (!receiveTime || !hopeArrive)
        return { text: "正常配送中", color: "green" };

      // 解析预计送达时间范围
      const [date, timeRange] = hopeArrive.split(" ");
      const [startTime, endTime] = timeRange.split("-");

      // 构造预计送达时间结束点
      const hopeArriveEndDate = new Date(`${date}T${endTime}:00`);
      const now = new Date();

      // 如果当前时间小于预计送达时间结束点，返回正常配送中
      if (now < hopeArriveEndDate)
        return { text: "正常配送中...", color: "green" };

      // 计算超时时间
      const diff = now - hopeArriveEndDate;
      const days = Math.floor(diff / (1000 * 60 * 60 * 24));
      const hours = Math.floor(
        (diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
      );
      const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
      const seconds = Math.floor((diff % (1000 * 60)) / 1000);

      let result = "已超时：";

      // console.log(days, hours, minutes, seconds, "222222222");

      if (days > 0) result += `${days}天`;
      if (hours > 0) result += `${hours}小时`;
      if (minutes > 0) result += `${minutes}分钟`;
      if (seconds > 0) result += `${seconds}秒`;
      this.overtimeInfo = { text: result, color: "#FF5722" };
    },
    calculateOverTime1(receiveTime, hopeArrive) {
      // //console.log(receiveTime, hopeArrive, "ddddddddddd");
      // 如果缺少必要参数，返回默认值
      if (!receiveTime || !hopeArrive)
        return { text: "正常配送中", color: "green" };

      // 解析预计送达时间范围
      const [date, timeRange] = hopeArrive.split(" ");
      const [startTime, endTime] = timeRange.split("-");

      // 构造预计送达时间结束点
      const hopeArriveEndDate = new Date(`${date}T${endTime}:00`);
      const now = new Date();

      // 如果当前时间小于预计送达时间结束点，返回正常配送中
      if (now < hopeArriveEndDate)
        return { text: "正常配送中...", color: "green" };

      // 计算超时时间
      const diff = now - hopeArriveEndDate;
      const days = Math.floor(diff / (1000 * 60 * 60 * 24));
      const hours = Math.floor(
        (diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
      );
      const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
      const seconds = Math.floor((diff % (1000 * 60)) / 1000);

      let result = "已超时：";

      // console.log(days, hours, minutes, seconds, "222222222");

      if (days > 0) result += `${days}天`;
      if (hours > 0) result += `${hours}小时`;
      if (minutes > 0) result += `${minutes}分钟`;
      if (seconds > 0) result += `${seconds}秒`;

      return { text: result, color: "red" };
    },
    getPhone(phone) {
      uni.makePhoneCall({
        phoneNumber: phone,
      });
    },
    showPic(urls, current) {
      wx.previewImage({
        current: current, // 当前显示图片的http链接
        urls: urls, // 需要预览的图片http链接列表
      });
    },
    //请求页面数据
    detailInfo(fn) {
      var path = "/xyb/order/user_detail";
      var data = {
        id: this.id,
      };
      ikz.post(path, data, (res) => {
        if (res.data.code) {
          this.show_info = res.data.data;
          if (this.show_info.annex_information_images) {
            this.show_info.annex_information_images =
              this.show_info.annex_information_images.split(",");
          }
        } else {
          uni.showModal({
            title: "提示",
            content: res.data.msg,
            showCancel: false,
            success: function (res) {},
          });
        }
        fn();
      });
    },
    cancel(id, item) {
      var temp_id = [
        // this.template_id.user_apply_cancel,
        this.template_id.business_refuse_user,
      ];

      //订阅消息
      var that = this;
      uni.requestSubscribeMessage({
        tmplIds: temp_id,
        success(res) {
          that.createOrder(id, index, item);
        },
        fail(res) {
          // that.up_status == 2;
          if (res.errCode == 20004) {
            uni.showModal({
              title: "提示",
              content: "请前往设置打开接受通知",
              confirmText: "确定",
              success(res) {
                that.createOrder(id, index, item);
              },
            });
          } else {
            uni.showModal({
              title: "提示",
              content: "未订阅消息，无法接收到订单通知",
              confirmText: "确定",
              success(res) {
                that.createOrder(id, index, item);
              },
            });
          }
        },
      });
    },
    createOrder(id, item) {
      console.log(item.receive_time, item.hope_arrive, "222");
      var that = this;
      // 检查是否超时十分钟
      const isOverTime = this.calculateOverTime1(
        item.receive_time,
        this.formatDateTime(item.hope_arrive)
      );
      console.log(isOverTime, "dddddddddddd");
      const overTimeText = isOverTime.text; // "已超时：3小时24分钟14秒" 或 "已超时：24分钟14秒"
      const hoursMatch = overTimeText.match(/(\d+)小时/);
      const minutesMatch = overTimeText.match(/(\d+)分钟/);
      const secondsMatch = overTimeText.match(/(\d+)秒/);

      const hours = hoursMatch ? parseInt(hoursMatch[1]) : 0;
      const minutes = minutesMatch ? parseInt(minutesMatch[1]) : 0;
      const seconds = secondsMatch ? parseInt(secondsMatch[1]) : 0;

      // 计算总分钟数（小时转换为分钟，秒转换为分钟，向上取整）
      const overTimeMinutes = hours * 60 + minutes + Math.ceil(seconds / 60);
      // console.log(overTimeMinutes, "overTimeMinutesoverTimeMinutes");
      // 如果超时十分钟，显示免责取消提示

      // 如果超时十分钟，显示免责取消提示
      if (overTimeMinutes >= 10) {
        uni.showModal({
          title: "提示",
          content: "订单已超时十分钟，可免责取消订单，系统将会退回全部费用。",
          success: function (res) {
            if (res.confirm) {
              that.processCancelOrder(id);
            }
          },
        });
      } else {
        // 正常取消订单逻辑
        uni.showModal({
          title: "提示",
          content: item.business_order_id
            ? !item.receive_id
              ? `确定取消订单？取消订单将会扣除全部费用的${item.super_goods.user_cancel_deduction}%`
              : "确定取消订单？取消订单将会扣除配送费跟保证金。"
            : "是否确认取消订单？",
          success: function (res) {
            if (res.confirm) {
              that.processCancelOrder(id);
            }
          },
        });
      }
    },
    //获取模板参数
    templateId(fn) {
      var path = "/xyb/wechat_mini_push/template_id_list";
      var data = {};
      ikz.post(path, data, (res) => {
        if (res.data.code) {
          this.template_id = res.data.data;
          console.log("template_id的值", this.template_id);
        } else {
          uni.showModal({
            title: "提示",
            content: res.data.msg,
            showCancel: false,
            success: function (res) {},
          });
        }
        fn();
      });
    },
    //取消订单
    cancel1(id, item) {
      const _this = this;
      var temp_id = [
        // this.template_id.user_apply_cancel,
        this.template_id.business_refuse_user,
      ];

      uni.requestSubscribeMessage({
        tmplIds: temp_id,
        success(res) {
          _this.processCancelOrder(id);
        },
        fail(res) {
          // that.up_status == 2;
          if (res.errCode == 20004) {
            uni.showModal({
              title: "提示",
              content: "请前往设置打开接受通知",
              confirmText: "确定",
              success(res) {
                _this.processCancelOrder(id);
              },
            });
          } else {
            uni.showModal({
              title: "提示",
              content: "未订阅消息，无法接收到订单通知",
              confirmText: "确定",
              success(res) {
                _this.processCancelOrder(id);
              },
            });
          }
        },
      });

      // // 正常取消订单逻辑
      // uni.showModal({
      //   title: "提示",
      //   content: "是否确认取消订单？",
      //   success: function (res) {
      //     if (res.confirm) {
      //       _this.processCancelOrder(id);
      //     }
      //   },
      // });
    },
    // 处理取消订单的公共逻辑
    processCancelOrder(id) {
      var path = "/xyb/order/cancel";
      var data = {
        orderid: id,
      };
      ikz.post(path, data, (res) => {
        if (res.data.code) {
          uni.showToast({
            title: "取消成功",
            duration: 2000,
          });
          setTimeout(function () {
            uni.navigateBack({
              delta: 1,
            });
          }, 2000);
          this.$forceUpdate();
        } else {
          uni.showModal({
            title: "提示",
            content: res.data.msg,
            showCancel: false,
            success: function (res) {},
          });
        }
      });
    },
    submit(id) {
      var that = this;
      uni.showModal({
        title: "提示",
        content: "确定货物已送达？",
        success: function (res) {
          if (res.confirm) {
            var path = "/xyb/order/confirm_complete";
            var data = {
              orderid: id,
            };
            uni.showLoading({
              title: "加载中",
            });
            ikz.post(path, data, (res) => {
              uni.hideLoading();
              if (res.data.code) {
                uni.showToast({
                  title: "确认收货成功",
                  duration: 2000,
                });
                that.detailInfo((res) => {});
                that.$forceUpdate();
              } else {
                uni.showModal({
                  title: "提示",
                  content: res.data.msg,
                  showCancel: false,
                  success: function (res) {},
                });
              }
            });
          } else if (res.cancel) {
            console.log("用户点击取消");
          }
        },
      });
    },
    //去支付
    pay(id, total_fee) {
      uni.navigateTo({
        url:
          "/pages/Component/Module/Payment/Program/pay/index/index?orderid=" +
          id +
          "&total_price=" +
          total_fee,
      });
    },
    confirm(id) {
      var that = this;
      uni.showModal({
        title: "提示",
        content: "确定订单已收货？",
        success: function (res) {
          if (res.confirm) {
            var path = "/xyb/order/confirm_complete";
            var data = {
              orderid: id,
            };
            ikz.post(path, data, (res) => {
              if (res.data.code) {
                uni.showToast({
                  title: "取消成功",
                  duration: 2000,
                });
                that.show_info.status = 3;
                that.$forceUpdate();
              } else {
                uni.showModal({
                  title: "提示",
                  content: res.data.msg,
                  showCancel: false,
                  success: function (res) {},
                });
              }
            });
          } else if (res.cancel) {
            console.log("用户点击取消");
          }
        },
      });
    },
  },
};
</script>

<style>
page {
  width: 100%;
  height: 100%;
  background: #f3f3f3;
}

.goods-info {
  background: #fff;
  border-radius: 20rpx;
  padding: 30rpx;
  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
}

.goods-item {
  display: flex;
  align-items: center;
  padding: 20rpx 0;
}

.goods-image {
  width: 160rpx;
  height: 160rpx;
  border-radius: 12rpx;
  margin-right: 30rpx;
  object-fit: cover;
}

.goods-detail {
  flex: 1;
}

.goods-name {
  font-size: 30rpx;
  color: #333;
  font-weight: 500;
  margin-bottom: 12rpx;
  display: block;
}

.goods-price {
  font-size: 32rpx;
  color: #ff6565;
  font-weight: bold;
  margin-bottom: 12rpx;
  display: block;
}

.goods-count {
  font-size: 28rpx;
  color: #666;
  background: #f5f5f5;
  padding: 8rpx 16rpx;
  border-radius: 20rpx;
  display: inline-block;
}

.ikz-tipss {
  box-sizing: border-box;
  width: 90%;
  margin: 30rpx auto;
  border-radius: 15rpx;
}

.ikz-tips-title {
  color: #fff;
}

.ikz-tips-desc {
  font-size: 25rpx;
  color: #fff;
  margin-top: 10rpx;
}

.ikz-orderdetail {
  width: 100%;
  height: 100%;
}

.ikz-orderdetail-top {
  box-sizing: border-box;
  width: 95%;
  background: #fff;
  margin: 30rpx auto;
  border-radius: 15rpx;
}

.ikz-orderdetail-top-code {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
}

.ikz-orderdetail-top-num {
  box-sizing: border-box;
  padding-left: 20rpx;
  font-size: 28rpx;
  color: #888;
}

.ikz-orderdetail-top-status {
  box-sizing: border-box;
  padding: 20rpx 30rpx;
  background: linear-gradient(to right, #f44336, #fbab7e);
  color: #fff;
  font-size: 28rpx;
  border-top-right-radius: 15rpx;
  border-bottom-left-radius: 15rpx;
}

.ikz-orderdetail-list-item {
  box-sizing: border-box;
  padding: 30rpx;
  border-radius: 15rpx;
}

.ikz-orderdetail-list-top {
  display: flex;
  align-items: center;
}

.ikz-orderdetail-list-img {
  width: 70rpx;
  height: 70rpx;
  border-radius: 50%;
}

.ikz-orderdetail-list-head-right {
  margin-left: 20rpx;
  width: 85%;
}

.ikz-orderdetail-list-head-right-box {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 50rpx;
}

.ikz-orderdetail-list-head-time {
  color: #888;
  font-size: 25rpx;
}

.ikz-orderdetail-list-head-card {
  background-color: #f44336;
  color: #fff;
  font-size: 23rpx;
  border-radius: 15rpx;
  padding: 0px 10rpx;
  text-align: center;
  line-height: 45rpx;
}

.ikz-orderdetail-list-head-price {
  color: #f44336;
}

.ikz-orderdetail-list-content {
  line-height: 45rpx;
  font-size: 30rpx;
  margin: 15rpx 0;
}

.ikz-orderdetail-list-head-name {
  font-size: 28rpx;
}

/* dibu*/
.ikz-orderdetail-other {
  box-sizing: border-box;
  width: 95%;
  background: #fff;
  margin: 30rpx auto;
  border-radius: 15rpx;
}

.ikz-orderdetail-other-top {
  display: flex;
  align-items: center;
}

.ikz-orderdetail-other-title {
  box-sizing: border-box;
  padding: 20rpx;
  line-height: 60rpx;
}

.ikz-orderdetail-other-top-title {
  color: #888;
  font-size: 28rpx;
}

.ikz-bottom {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 20rpx;
}
.ikz-help-btn {
  position: relative;
  width: 80%;
  background: #ff6565;
  border-radius: 50rpx;
  color: #fff;
  text-align: center;
  line-height: 100rpx;
  margin-bottom: 15rpx;
}
.ikz-help-btn1 {
  position: relative;
  width: 80%;
  background: #d54242;
  border-radius: 50rpx;
  color: #fff;
  text-align: center;
  line-height: 100rpx;
  margin-bottom: 20rpx;
}
.ikz-help-btn2 {
  position: relative;
  width: 80%;
  background: #76a8fd;
  border-radius: 50rpx;
  color: #fff;
  text-align: center;
  line-height: 100rpx;
  margin-bottom: 20rpx;
}
/* ad */

/* 快递 */
.ikz-take {
  box-sizing: border-box;
  padding: 30rpx;
  width: 95%;
  margin: 30rpx auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border-radius: 15rpx;
}

.ikz-take-img {
  width: 80rpx;
  height: 80rpx;
}

.ikz-take-title {
  font-size: 30rpx;
}

.ikz-take-center {
  width: 50%;
  line-height: 50rpx;
}

.ikz-take-tips {
  color: #888888;
  font-size: 28rpx;
}

.ikz-take-option {
  width: 50rpx;
  height: 50rpx;
}

.ikz-take-right {
  width: 25%;
  display: flex;
  align-items: center;
}

.ikz-take-num {
  width: 40%;
  text-align: center;
}

/* 快递 */

.ikz-tips {
  box-sizing: border-box;
  padding: 10rpx 40rpx;
  width: 95%;
  background: #fff;
  margin: 10px auto;
  border-radius: 15rpx;
}

.ikz-tips-item {
  padding: 20rpx 0px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ikz-tips-item:before {
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  height: 1px;
  border-top: 1rpx solid #d9d9d9;
  color: #d9d9d9;
  left: 0px;
}

.ikz-tips-item:first-child:before {
  display: none;
}

.ikz-tips-help-title {
  line-height: 60rpx;
}

.ikz-tips-help-content {
  line-height: 50rpx;
  color: #828282;
}

.ikz-tips-price {
  color: #828282;
}
.ikz-updata-img {
  width: 150rpx;
  height: 150rpx;
}
.ikz-updata-add {
  position: relative;
  margin-left: 10rpx;
}
.ikz-updata-img {
  width: 150rpx;
  height: 150rpx;
}
.ikz-updata-bottom {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 20rpx;
}

.ikz-sticky-spot {
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  background-color: #76a8fd;
  margin-right: 20rpx;
}

.ikz-sticky-spot1 {
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  background-color: #ff8800;
  margin-right: 20rpx;
}
.ikz-sticky-spot2 {
  width: 20rpx;
  height: 20rpx;
  border-radius: 50%;
  background-color: #009423;
  margin-right: 20rpx;
}
/* 其他 */
.ikz-receive-box {
  width: 95%;
  background: #fff;
  margin: 10px auto;
  border-radius: 15rpx;
  overflow: hidden;
}
.ikz-receive-box-top {
  box-sizing: border-box;
  padding: 30rpx 30rpx;
}
.ikz-receive-title {
  display: flex;
  align-items: center;
}
.ikz-receive-img {
  margin-right: 15rpx;
  width: 40rpx;
  height: 40rpx;
}
.ikz-receive-user {
  display: flex;
  align-items: center;
  margin-top: 40rpx;
}
.ikz-receive-user-img {
  margin-right: 20rpx;
  width: 70rpx;
  height: 70rpx;
  border-radius: 50%;
}
.ikz-detail-phone {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #85b2ff;
  color: #fff;
  border-bottom-left-radius: 15rpx;
  border-bottom-right-radius: 15rpx;
  line-height: 80rpx;
}
.ikz-detail-phone-img {
  width: 30rpx;
  height: 30rpx;
  margin-right: 15rpx;
}
</style>
